import React,{Component}from 'react';
import E from 'wangeditor';
// import axios from 'axios';
class AllEditor extends Component{
    componentDidMount() {
        var editor = new E('#topeditor','#editor');
        var that = this;
        editor.customConfig.onchange = function (html) {
            editor.txt.html(html)
            that.props.GetRichText(html)
        }
        // 自定义菜单配置
        editor.customConfig.menus = [
            'head',  // 标题
            'bold',  // 粗体
            'fontSize',  // 字号
            'fontName',  // 字体
            'italic',  // 斜体
            'underline',  // 下划线
            'strikeThrough',  // 删除线
            'foreColor',  // 文字颜色
            'backColor',  // 背景颜色
            'link',  // 插入链接
            'image',  // 插入图片
            'list',  // 列表
            'justify',  // 对齐方式
            'quote',  // 引用
            'table',  // 表格
            'code',  // 插入代码
        ]
        editor.customConfig.colors = ['#000000','#eeece0','#1c487f','#4d80bf','#c24f4a','#8baa4a']
        // 隐藏“网络图片”tab
        editor.customConfig.showLinkImg = false;
        // 自定义图片上传
        // editor.customConfig.customUploadImg = function (files, insert) {
        //     // files 是 input 中选中的文件列表
        //     // insert 是获取图片 url 后，插入到编辑器的方法
        //     // 上传代码返回结果之后，将图片插入到编辑器中
        //     //insert(imgUrl)
            
        //     const token = 'baecae71717180ad06fe82494b68a6f7300ea0e7:y_faTDAE5TCgh5EiLGWr7ItQcd8=:eyJkZWFkbGluZSI6MTU2NTc1NDAyNSwiYWN0aW9uIjoiZ2V0IiwidWlkIjoiNjk2NTAyIiwiYWlkIjoiMTYyMzM4NyIsImZyb20iOiJ3ZWIifQ=='
        //     const formData = new FormData();
        //     files.forEach(file => {
        //         formData.append('formData', file);
        //     });
        //     formData.append('Token', token);
           
        //     var urlt = '/api/weather/city/101030100'
         
        //     axios.get(urlt).then((res)=>{
        //         console.log(res)
        //     })
        // }
        editor.customConfig.uploadImgShowBase64 = true
        editor.create()
        
    }
    render(){
        return(
            <div className="all-wangeditor">
                <div id='topeditor' style={{backgroundColor:'#f1f1f1',border:"1px solid #ccc"}}></div>
                <div>隔离带</div>
                <div id='editor' style={{height:500,border:"1px solid #ccc"}}>
                    <p dangerouslySetInnerHTML={{__html: this.props.propsInfo.htmlinfo}}></p>
                </div>
            </div>
        )
    }
}
export default AllEditor